<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>

        // 数组映射
        // const arr = [1, 2, 3, 4];
        // // // const expect = [11, 22, 33, 44];

        // const res = arr.map((item) => item * 11);

        // 已知
        // const arr = ['a', 'b', 'c', 'd'];
        // const mapping = {
        //     a: 1,
        //     b: 2,
        //     c: 3,
        //     d: 4,
        // };
        // // 期待
        // const expect = [1, 2, 3, 4];

        // const res = [];
        // for (const item of arr) {
        //     const newItem = mapping[item];
        //     res.push(newItem);
        // }
        // console.log(res);

        // // item: 'a' 'b'
        // const res = arr.map((item) => mapping[item]);

        // 已知
        // const str = 'abcd';
        // const mapping = {
        //     a: 1,
        //     b: 2,
        //     c: 3,
        //     d: 4,
        // };
        // // 期待
        // const expect = '1234';

        // let res = '';
        // for (let i = 0; i < str.length; i++) {
        //     const letter = str[i]; // 'a'
        //     res += mapping[letter] // 1
        //     // to do
        // }
        // console.log(res);

        // function fn (item) {
        //     return item * 11;
        // }
        // ruleFunc: 规则函数
        // function map (arr, ruleFunc) {
        //     const result = [];
        //     for (const item of arr) {
        //         // 1
        //         const newItem = ruleFunc(item); // 11
        //         result.push(newItem);
        //     }
        //     return result;
        // }

        // function fn (item) {
        //     return item * 11;
        // }

        // const a = 2;
        // const res = fn(a);

        // const res = map(arr, fn);


        // const str = 'abcd';
        // function mapping (letter) {
        //     switch (letter) {
        //         case 'a':
        //             return 1;
        //         case 'b':
        //             return 2;
        //         case 'c':
        //             return 3;
        //         case 'd':
        //             return 4;

        //         default:
        //             return null;
        //     }
        // }
        // // 期待
        // const expect = '1234';

        // let res = '';
        // for (let i = 0; i < str.length; i++) {
        //     const letter = str[i]; // 'a'
        //     res += mapping[letter] // 1
        //     // to do
        // }
        // console.log(res);


        // const color = '#ff0000';
        // const mapping = {
        //     0: 0,
        //     1: 1,
        //     2: 2,
        //     3: 3,
        //     4: 4,
        //     5: 5,
        //     6: 6,
        //     7: 7,
        //     8: 8,
        //     9: 9,
        //     a: 10,
        //     b: 11,
        //     c: 12,
        //     d: 13,
        //     e: 14,
        //     f: 15,
        // };
        // const expect = 'rgb(255, 0, 0)';

        // const colorStr = color.substr(1); // 'f00000'  f0 >>> 240 >>> 16 * 15 + 0
        // console.log(colorStr);

        // let res = []; // [255, 0, 0]
        // for (let i = 0; i < colorStr.length; i += 2) {
        //     // 第一轮 i: 0, 1
        //     // 第二轮 i: 2, 3
        //     const letter1 = colorStr[i]; // 'f'
        //     const letter2 = colorStr[i + 1]; // 'f'
        //     const num1 = mapping[letter1]; // 15
        //     const num2 = mapping[letter2]; // 15
        //     const color = num1 * 16 + num2; // 255
        //     // 23  >>> 2 * 10 + 3
        //     res.push(color);
        // }
        // // console.log(res.join(', '));
        // console.log(`rgb(${res.join(', ')})`);

        // 案例 leetcode 罗马数字转整数简单版
        // 已知
        // const roman = 'LVIII'; // 50 5 1 1 1
        // const mapping = {
        //     L: 50,
        //     V: 5,
        //     I: 1,
        // };
        // // 期待的结果
        // const expect = 58;

        // 'VII' >>> 7
        // 'III' >>> 3
        // 'LV' >>> 55
        // 'LII' >>> 52

        // let sum = 0;
        // for (const letter of roman) {
        //     console.log(letter); // 'L'
        //     console.log(mapping[letter]); // 50
        //     sum += mapping[letter];
        // }
        // console.log(sum);

        // 案例
        // const data = {
        //     zhangsan: 0,
        //     lisi: 1,
        //     wangwu: 2,
        //     liuliu: 99,
        // };

        // const expect = [
        //     {
        //         name: 'zhangsan',
        //         id: 0,
        //     },
        //     {
        //         name: 'lisi',
        //         id: 1,
        //     },
        //     {
        //         name: 'wangwu',
        //         id: 2,
        //     },
        //     {
        //         name: 'liuliu',
        //         id: 99,
        //     },
        // ];

        // const res = [];
        // for (const key in data) {
        //     // key: 'zhangsan'
        //     // data[key]: 0
        //     res.push({
        //         name: key,
        //         id: data[key],
        //     });
        // }

        // console.log(res);

        // 案例
        // 映射关系
        // const cityInfo = {
        //     渝: '重庆',
        //     川: '四川',
        //     黑: '黑龙江',
        //     吉: '吉林',
        //     辽: '辽宁',
        // };

        // // 数据
        // const data = [
        //     '渝A 188888',
        //     '渝B 666888',
        //     '黑A 666888',
        //     '川A 666888',
        //     '辽C 666888',
        //     '吉A 666812',
        //     '黑C 666888',
        //     '渝A 777777',
        // ];

        // // 期待得到的结果
        // const expect = [
        //     {
        //         province: '重庆',
        //         id: 188888,
        //     },
        //     {
        //         province: '重庆',
        //         id: 666888,
        //     },
        //     {
        //         province: '黑龙江',
        //         id: 666888,
        //     },
        //     {
        //         province: '四川',
        //         id: 666888,
        //     },
        //     {
        //         province: '辽宁',
        //         id: 666888,
        //     },
        //     {
        //         province: '吉林',
        //         id: 666812,
        //     },
        //     {
        //         province: '黑龙江',
        //         id: 666888,
        //     },
        //     {
        //         province: '重庆',
        //         id: 777777,
        //     },
        // ];

        // const res = data.map((item) => {
        //     // item: '渝A 188888'
        //     const tmpArr = item.split(' '); // ['渝A', '188888']
        //     return {
        //         province: cityInfo[ item[0] ], // to do
        //         id: tmpArr[1], // to do
        //     };
        // });

        // console.log(res);

        // const numStr = '渝A 188888';

        // const provinceInfo = [
        //     {
        //         short: '渝',
        //         province: '重庆',
        //         cities: [
        //             {
        //                 code: 'A',
        //                 name: '渝中区',
        //             },
        //             {
        //                 code: 'B',
        //                 name: '渝北区',
        //             },
        //             {
        //                 code: 'C',
        //                 name: '沙坪坝区',
        //             },
        //             {
        //                 code: 'D',
        //                 name: '巴南区',
        //             },
        //         ],
        //     },
        //     {
        //         short: '川',
        //         province: '四川',
        //         cities: [
        //             {
        //                 code: 'A',
        //                 name: '成都',
        //             },
        //             {
        //                 code: 'B',
        //                 name: '绵阳',
        //             },
        //             {
        //                 code: 'C',
        //                 name: '泸州',
        //             },
        //             {
        //                 code: 'D',
        //                 name: '宜宾',
        //             },
        //         ],
        //     },
        // ];

        // // 期待
        // const expect = {
        //     province: '重庆',
        //     city: '渝中区',
        //     id: '188888',
        // };

        function getCarInfo (carNum) {
            const shortProvinceName = carNum[0]; // '渝'
            const cityCode = carNum[1]; // 'A'
            const id = carNum.split(' ')[1]; // '188888'

            // 在省数组中找到省信息
            const mapping = provinceInfo.find((item) => item.short === shortProvinceName);

            console.log(mapping.province); // '重庆'

            // 在当前省的城市数组中找到城市信息
            const cityMapping = mapping.cities.find((city) => city.code === cityCode);

            console.log(cityMapping.name); // '渝中区'

            const res = {
                province: mapping.province,
                city: cityMapping.name,
                // id: id,
                id, // es6
            };
            return res;
        }

        // 案例
        const data = [
            '渝A 188888',
            '川B 666888',
            '川A 666888',
            '渝D 777777',
        ];

        const provinceInfo = [
            {
                short: '渝',
                province: '重庆',
                cities: [
                    {
                        code: 'A',
                        name: '渝中区',
                    },
                    {
                        code: 'B',
                        name: '渝北区',
                    },
                    {
                        code: 'C',
                        name: '沙坪坝区',
                    },
                    {
                        code: 'D',
                        name: '巴南区',
                    },
                ],
            },
            {
                short: '川',
                province: '四川',
                cities: [
                    {
                        code: 'A',
                        name: '成都',
                    },
                    {
                        code: 'B',
                        name: '绵阳',
                    },
                    {
                        code: 'C',
                        name: '泸州',
                    },
                    {
                        code: 'D',
                        name: '宜宾',
                    },
                ],
            },
        ];

        // const expect = [
        //     {
        //         province: '重庆',
        //         city: '渝中区',
        //         id: '188888',
        //     },
        //     {
        //         province: '四川',
        //         city: '绵阳',
        //         id: '666888',
        //     },
        //     {
        //         province: '四川',
        //         city: '成都',
        //         id: '666888',
        //     },
        //     {
        //         province: '重庆',
        //         city: '巴南区',
        //         id: '777777',
        //     },
        // ];

        const res = data.map((item) => getCarInfo(item));

        console.log(res);

    </script>
</body>
</html>